
<template>
  <div class="send">
    <el-dialog
      title="回退"
      :visible.sync="visible"
      @close="close"
      :showreturnDialog="showreturnDialog"
      class="sendhead"
    >
      <div>
        <div class="top">
          <div class="choose">
            选择回退节点:
            <el-select v-model="nodename" placeholder="请选择">
              <el-option
                v-for="item in node"
                :key="item.id"
                :label="item.name"
                :value="item.name"
              >
              </el-option>
            </el-select>
          </div>
            <div class="choose1">
            选择回退到的负责人:
            <el-select v-model="personname" placeholder="请选择">
              <el-option
                v-for="item in person"
                :key="item.id"
                :label="item.assigneeName"
                :value="item.assigneeName"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="center" style="text-align: center">
          <span class="star">*</span>备注/意见:
          <textarea
            name=""
            id=""
            cols="90"
            rows="7"
            v-model="opinion"
          ></textarea>
        </div>
        <div class="bottom" style="text-align: center">
          <el-button size="small" @click="close">取 消</el-button>&nbsp;&nbsp;
          <el-button size="small" type="primary" @click="onSubmit"
            >确 定</el-button
          >
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {returnBack,responseMan,confirmBack} from  '@/api/ywsp/db.js'
// responseMan,confirmBack
export default {
  props: {
    showreturnDialog: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      //多选框的数据
      fullname: "",
      taskid: "",
      checkList: [],
      visible: this.showreturnDialog,
      opinion: "",
      node:[],
      person:[],
      id:'',
      //下拉框的选择
      nodename:'',
      personname:'',
      userId:'',
    };
  },
  async created(){
    this.taskid=this.$route.query.id
    const res =await returnBack({taskId: this.taskid}) 
    console.log(res)
    this.node=res.data.result.data
    this.id=res.data.result.data[0].id
    console.log(this.id)
    // 负责人
    const res1 =await responseMan({taskId:this.taskid,taskKey:this.id}) 
    console.log(res1)
    this.person=res1.data.result.data
    this.userId=res1.data.result.data[0].assignee
    console.log(this.userId)
  },

  watch: {
    showreturnDialog() {
      this.visible = this.showreturnDialog;
    },
  },
  methods: {
    close() {
      this.$emit("update:showreturnDialog", false);
    },
   async  onSubmit() {
      await confirmBack(JSON.stringify({newActivityId:this.id,
      operate:'backToNode',
      taskId:this.taskid,
      userId:this.userId,
      userName:this.personname,
      option:this.opinion,
      priority:0,
      taskTitle:this.nodename
      }))
      this.$message({
        message:'回退成功!',
        type:'success'
      })
      this.close();

    },
  },
};
</script>

<style lang="scss" scoped>
.send {
  /deep/ .sendhead .el-dialog .el-dialog__header {
    height: 42px;
    background: #f4f6f8 !important;
  }
  /deep/.el-dialog__title {
    font-size: 14px;
    color: black;
    font-weight: bold;
  }
  .center {
    margin-top: 50px;
    font-weight: bold;
    .star {
      color: red;
    }
    textarea {
      vertical-align: top;
      border-radius: 4px;
      border: 1px solid #dfe2eb;
      resize: none;
      outline: none;
      text-indent: 1em;
      ::placeholder {
        color: #dfe2eb !important;
      }
    }
    textarea:focus {
      border: 1px solid skyblue;
    }
  }
  .top {
    margin-left: 115px;
    font-weight: bold;
    .choose{
      margin-left:-40px;
      
    }
    .choose1{
      margin-top:30px;
      margin-left:-80px;
    }
  }
  .bottom {
    margin-top: 30px;
  }
}
</style>